<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=3,minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
	<title>回收订单</title>
	<link href="css/public/reset-html5.css" rel="stylesheet">
	<link href="css/public/mui.min.css" rel="stylesheet">
	<link href="css/wx-main.css?20161028_1" rel="stylesheet">
	<link rel="stylesheet" href="css/orderlist.css">
</head>
<body id="main">

<div class="mui-row mar-top mar-btm pad">
	<ul id="top">
		<li name="2">
			<p>待接单</p>
			<div v-text="orderCount0">0</div>
		</li>
		<li style="margin-left: 0" name="3">
			<p>待回收</p>
			<div v-text="orderCount1">0</div>
		</li>
		<li style="margin-left: 0" name="0">
			<p>全部订单</p>
			<div v-text="orders.length"></div>
		</li>
	</ul>
</div>

<div>
	<div class="primary-text pad status">
		<span>回收订单列表</span>
		<select id="status" v-model="cStatus">
			<option value="0">全部订单</option>
			<option value="2">待接单</option>
			<option value="3">待回收</option>
			<option value="4">待确认</option>
			<option value="6">已完成</option>
		</select>
	</div>
	
	<div style="clear: both"></div>
	
	<div class="mui-card" v-show="orders.length==0">
		<div class="mui-card-content">
			<div class="mui-card-content-inner">暂无订单数据</div>
		</div>
	</div>
	
	<div v-for="o in orders" v-show="o.status==cStatus || cStatus==0" v-on:click="orderDetail(o)" class="mui-card order-card">
		<table>
			<tr>
				<td width="95">订单编号</td>
				<td >
					<span v-text="o.order_num"></span>
					<span v-text="status[o.status]" style="position:relative;top:5px;float:right;color:#ff9800;"></span>
				</td>
			</tr>
			<tr>
				<td>下单时间</td>
				<td v-text="o.v_date"></td>
			</tr>
			<tr>
				<td>回收机型</td>
				<td v-text="o.v_name"></td>
			</tr>
			<tr>
				<td>预估费用</td>
				<td v-text="o.valuation"></td>
			</tr>
		</table>
	</div>
</div>

</body>
<script src="../js/jquery-2.2.1.min.js"></script>
<script src="../plugins/vue/vue.min.js"></script>
<script src="js/phone.js"></script>
<script src="js/public.js"></script>
<script src="layer_mobile/layer.js"></script>
<script>
	var vue = new Vue({
		el: "#main",
		data: {
			orders:[],
			orderCount0:0,
			orderCount1:0,
			orderCount2:0,
			cStatus:"0",
			status:recycleStatus
		},
		methods: {
			/*加载回收订单*/
			loadOrders:function(){
				var index = layer.open({type: 2,shadeClose:false});
				$.get(apiRecycle+"index.php/Home/Master/get_master_order", {}, function(res){
					vue.orders = res.data;
					vue.orderCount0 = 0;
					vue.orderCount1 = 0;
					for(var i=0; i<res.data.length; i++){
						if(res.data[i].status == '1'){
							vue.orderCount0+=1;
						} else if(res.data[i].status == '2'){
							vue.orderCount1+=1;
						}
					}
					layer.close(index);
				}, "json");
			},
			/*跳转到订单详情*/
			orderDetail:function(order){
				location.href="recycle_order_info.html?rid="+order.rid;
			}
		},
		ready: function () {
			this.loadOrders();
		}
	});
</script>
</html>